﻿
@{
    ViewData["Title"] = "DivIndex";
}

<style>
    html, body {
        margin: 0;
        height: 100%;
    }

    #divshelter {
        width: 100%;
        height: 100%;
        background-color: #000;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;
        opacity: 0.3;
        /*兼容IE8及以下版本浏览器*/
        filter: alpha(opacity=30);
        display: none;
    }

    #divtip {
        width: 200px;
        height: 200px;
        background-color: #FF0;
        margin: auto;
        position: absolute;
        z-index: 3;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        display: none;
    }
</style>

<script>
    function openshelter() {
        var s = document.getElementById("divshelter");
        s.style.display = "block";

        var l = document.getElementById("divtip");
        l.style.display = "block";
    }

    function cancellog() {
        var s = document.getElementById("divshelter");
        s.style.display = "none";

        var l = document.getElementById("divtip");
        l.style.display = "none";
    }
</script>
<h1>DivIndex</h1>

<a href="javascript:openshelter()">打开遮罩</a>
<div id="divshelter"></div>
<div id="divtip">
    <a href="javascript:cancellog()">关闭</a>
</div>